/**
 * Constructor
 */
function Phasor(canvas, matrixX, matrixY) {
    if(!canvas.getContext) {
        throw "No canvas";
    }    
    if (canvas.width != canvas.height) {
        throw "El canvas no es cuadrado";
    }
    this.canvas = canvas;
    this.ctx = canvas.getContext("2d");
    // muevo el eje al centro
    this.ctx.translate(canvas.width / 2, canvas.height / 2);
    // espejo según el eje X
    this.ctx.transform(1,0,0,-1,0,0);
    // escaleo a la nueva unidad
    this.ctx.scale(canvas.width / matrixX, canvas.height / matrixY);
    // tomo el factor usado para el thickness
    this.factor = (matrixX / canvas.width + matrixY / canvas.height) / 2;
    // guardo la pos max en X y en Y (deberían ser iguales, es cuadrado)
    this.maxX = matrixX / 2;
    this.maxY = matrixY / 2;
    this.setThickness(1);
    this.clear();
    this.draw();
}

/**
 * clase que representa un fasor
 */
Phasor.Vector = function (mod, angle) {
    this.mod = mod;
    this.angle = angle;
}

/**
 * setea el thickness de las lineas
 */
Phasor.prototype.setThickness = function (thick) {
    this.ctx.lineWidth = thick * this.factor;
}

/**
 * dibuja todo el plot
 */
Phasor.prototype.draw = function () {
    this.drawQuadrants();
    var vec = null;
    for (vec in this.vectors) {
        this.drawVector(this.vectors[vec]);
    }
}

/**
 * dibuja solo los ejes con el fondo del plot
 */
Phasor.prototype.drawQuadrants = function () {
    var ctx = this.ctx;
    ctx.clearRect(-this.maxX, -this.maxY, this.maxX * 2, this.maxY * 2);
    ctx.beginPath();
    this.setThickness(0);
    ctx.arc(0,0,this.maxX,0,Math.PI * 2,false);
    ctx.closePath();
    ctx.fillStyle="rgba(0,0,200,0.5)";
    ctx.fill();
    ctx.beginPath();
    this.setThickness(3);
    ctx.moveTo(-this.maxX, 0);
    ctx.lineTo(this.maxX, 0);
    ctx.moveTo(0, -this.maxY);
    ctx.lineTo(0, this.maxY);
    ctx.closePath();
    ctx.stroke();
}

/**
 * dibuja un vector en el plot
 */
Phasor.prototype.drawVector = function (vec) {
    var arrow_lenght = this.maxX / 15;
    var arrow_width = this.maxX / 20;
    var ctx = this.ctx;
    this.setThickness(3);
    
    ctx.beginPath();
    ctx.moveTo(0,0);
    ctx.rotate(this.toRad(vec.angle));
    ctx.lineTo(vec.mod - arrow_lenght,0);
    ctx.closePath();
    ctx.stroke();
    
    ctx.beginPath();
    ctx.moveTo(vec.mod, 0);
    ctx.lineTo(vec.mod - arrow_lenght, arrow_width / 2);
    ctx.lineTo(vec.mod - arrow_lenght, -arrow_width / 2);
    ctx.lineTo(vec.mod, 0);
    ctx.closePath();
    ctx.fillStyle="rgba(0,100,200,0.5)";
    ctx.fill();
    
    ctx.rotate(-this.toRad(vec.angle));
    
    ctx.stroke();
}

/**
 * pasa angulos a radianes
 */
Phasor.prototype.toRad = function(angle) {
    return (angle / 180) * Math.PI;
}

/**
 * se borran todos los vectores 
 */
Phasor.prototype.clear = function () {
    this.vectors = new Object;
}

/**
 * suma un nuevo vector al plot
 */
Phasor.prototype.addVector = function (name, mod, angle) {
    this.vectors[name] = new Phasor.Vector(mod, angle);
}
